body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside,
details, figcaption, figure, hgroup, menu, nav {
  margin: 0;
  padding: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit; }

input, textarea, select {
  *font-size: 100%; }

a {
  text-decoration: none;
  color: #000000; }

.fl {
  float: left; }

.fr {
  float: right; }

.clearfix {
  clear: both; }

body {
  width: 100%; }

body {
  width: 100%; }

section {
  width: 1366px;
  margin: 0 auto;
  padding-bottom: 44px; }

.nav {
  margin-top: 24px;
  margin-left: 182px;
  height: 12px;
  font-size: 12px;
  color: #444f58;
  margin-bottom: 23px; }

.banner {
  border-top: 1px solid #efefef;
  font-size: 0;
  position: relative; }
  .banner img {
    width: 1366px;
    height: 310px; }
  .banner .bannernav {
    position: absolute;
    width: 442px;
    height: 310px;
    right: 0;
    top: 0; }
    .banner .bannernav .bannernavbar {
      height: 6px;
      margin-top: 293px;
      text-align: center; }
      .banner .bannernav .bannernavbar ul {
        display: inline-block; }
        .banner .bannernav .bannernavbar ul .active {
          background-color: #e60012; }
        .banner .bannernav .bannernavbar ul li {
          width: 6px;
          height: 6px;
          border-radius: 50%;
          background-color: white;
          margin-right: 5px;
          display: inline-block;
          cursor: pointer; }
        .banner .bannernav .bannernavbar ul li:last-of-type {
          margin-right: 0; }

.seach {
  width: 958px;
  height: 52px;
  margin: 12px auto 0 auto;
  border: 1px solid #efefef; }
  .seach .active {
    margin-top: 19px;
    margin-left: 28px;
    height: 14px;
    width: 77px;
    border-right: 1px solid #efefef;
    line-height: 14px; }
    .seach .active a {
      color: #e60012;
      font-size: 13px; }
  .seach .no {
    margin-top: 19px;
    margin-left: 18px;
    height: 14px;
    line-height: 14px; }
    .seach .no a {
      color: #444f58;
      font-size: 14px; }
  .seach .searchbar {
    width: 190px;
    height: 30px;
    font-size: 0;
    position: relative;
    margin-right: 21px;
    margin-top: 11px; }
    .seach .searchbar input[type="text"] {
      width: 145px;
      height: 28px;
      font-size: 13px;
      padding-left: 17px;
      line-height: 28px;
      border: 1px solid #444f58;
      border-radius: 15px;
      padding-right: 28px;
      outline: none; }
    .seach .searchbar input[type="image"] {
      position: absolute;
      width: 14px;
      height: 14px;
      top: 7px;
      right: 12px;
      outline: none; }

.main {
  width: 960px;
  margin: 14px auto 0 auto; }
  .main .maincell {
    width: 958px;
    height: 298px;
    border: 1px solid #efefef;
    margin-top: 14px; }
    .main .maincell:first-of-type {
      margin-top: 0; }
    .main .maincell .brand {
      width: 218px;
      height: 193px;
      margin-top: 54px;
      font-size: 0;
      text-align: center; }
      .main .maincell .brand img {
        display: inline-block;
        width: 70px;
        height: 70px; }
      .main .maincell .brand p:first-of-type {
        margin-top: 22px;
        font-size: 13px;
        color: #e60012; }
      .main .maincell .brand p:nth-of-type(2) {
        margin-top: 12px;
        font-size: 12px;
        color: #444f58; }
      .main .maincell .brand .guanzhu {
        width: 58px;
        height: 26px;
        border-radius: 3px;
        font-size: 15px;
        background-color: #e60012;
        margin-top: 39px;
        display: inline-block;
        color: white;
        text-align: center;
        line-height: 26px; }
    .main .maincell .clothes {
      width: 720px;
      height: 260px;
      margin-top: 19px; }
      .main .maincell .clothes .clothes-cell {
        width: 172px;
        height: 260px;
        margin-right: 10px;
        transition: all 1s; }
        .main .maincell .clothes .clothes-cell:hover .clothes-warp > img {
          -webkit-transform: scale(1.2);
                  transform: scale(1.2);
          transition: -webkit-transform 0.5s;
          transition: transform 0.5s;
          transition: transform 0.5s, -webkit-transform 0.5s; }
        .main .maincell .clothes .clothes-cell:nth-of-type(4n) {
          margin-right: 0; }
        .main .maincell .clothes .clothes-cell:hover {
          box-shadow: 0px 0px 12px black; }
        .main .maincell .clothes .clothes-cell .bottom {
          background-color: #efefef;
          font-size: 0; }
          .main .maincell .clothes .clothes-cell .bottom p:first-of-type {
            font-size: 14px;
            width: 84px;
            text-align: left;
            height: 14px;
            transition: all 1s; }
          .main .maincell .clothes .clothes-cell .bottom p:nth-of-type(2) {
            height: 10px;
            color: #444f58;
            margin-top: 10px;
            transition: all 1s;
            text-align: left; }
          .main .maincell .clothes .clothes-cell .bottom div {
            height: 20px;
            margin-top: 4px;
            text-align: right;
            font-size: 0;
            transition: all 1s; }
            .main .maincell .clothes .clothes-cell .bottom div .like {
              height: 20px;
              width: 83px;
              display: inline-block;
              text-align: center;
              font-size: 11px;
              line-height: 20px;
              color: white;
              background-color: black;
              border-radius: 10px; }
              .main .maincell .clothes .clothes-cell .bottom div .like a {
                color: white; }
                .main .maincell .clothes .clothes-cell .bottom div .like a img {
                  width: 11px;
                  height: 11px;
                  vertical-align: -2px;
                  margin-left: 7px;
                  margin-top: 4px; }
        .main .maincell .clothes .clothes-cell .clothes-warp {
          overflow: hidden; }
          .main .maincell .clothes .clothes-cell .clothes-warp img {
            width: 170px;
            height: 170px;
            display: block;
            border: 1px solid #efefef; }
        .main .maincell .clothes .clothes-cell .clothes-bottom {
          padding-top: 10px;
          padding-left: 12px;
          padding-bottom: 10px;
          padding-right: 9px;
          width: 151px;
          height: 68px; }

.tiaozhuan {
  width: 960px;
  margin: 40px auto 0 auto;
  font-size: 0; }
  .tiaozhuan .tiaozhuanbar {
    display: inline-block;
    height: 38px;
    line-height: 36px; }
    .tiaozhuan .tiaozhuanbar .numberwarp {
      width: 36px;
      height: 36px;
      border: 1px solid #efefef;
      font-size: 10px;
      line-height: 36px;
      border-radius: 3px;
      text-align: center;
      color: #444f58;
      margin-left: 9px;
      cursor: pointer; }
      .tiaozhuan .tiaozhuanbar .numberwarp a {
        display: block;
        width: 100%;
        height: 100%; }
      .tiaozhuan .tiaozhuanbar .numberwarp:first-of-type {
        margin-left: 0; }
    .tiaozhuan .tiaozhuanbar .active {
      border: 1px solid red;
      color: red; }
    .tiaozhuan .tiaozhuanbar .no {
      border: 1px solid white; }
    .tiaozhuan .tiaozhuanbar .morewarp {
      width: 66px;
      height: 36px;
      border: 1px solid #efefef;
      font-size: 10px;
      line-height: 36px;
      border-radius: 3px;
      text-align: center;
      color: #444f58;
      margin-left: 9px;
      cursor: pointer; }
      .tiaozhuan .tiaozhuanbar .morewarp a {
        display: block;
        width: 100%;
        height: 100%; }
